<template>
  <div class="index">
    <div class="DMX">
      <div class="dataFormTitle">写码功能</div>
      <div class="onlineControl">
        <div class="onlineControlItems">
          <div class="itemsCont">
            <el-radio v-model="radio"
                      label="1">按通道</el-radio>
            <el-radio v-model="radio"
                      label="2">按灯数</el-radio>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">起始通道</div>
            <div class="tdled">
              <el-input-number size="medium"
                               v-model="inputNum"></el-input-number>
            </div>
            <div class="tdled">(1-4096)</div>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">通道间隔</div>
            <div class="tdled">
              <el-input-number size="medium"
                               v-model="inputJgNum1"></el-input-number>
            </div>
            <div class="tdled">(0-255)</div>
          </div>
        </div>
        <div class="onlineControlItems">
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">芯片型号</div>
            <div class="tdled">
              <el-select v-model="chipValue"
                         placeholder="请选择"
                         style="width: 130px;">
                <el-option v-for="item in chipOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </div>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">指定分控</div>
            <div class="tdled">
              <el-select v-model="designatedValue"
                         placeholder="请选择"
                         style="width: 130px;">
                <el-option v-for="item in designatedOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </div>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">指定端口</div>
            <div class="tdled">
              <el-select v-model="tcpValue"
                         placeholder="请选择"
                         style="width: 130px;">
                <el-option v-for="item in tcpOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </div>
          </div>
        </div>
        <div class="onlineControlItems"
             style="width:6px">
          <div class="xmBtn">
            <el-button @click="doWriteCode()">写码</el-button>
          </div>
        </div>
      </div>
    </div>
    <div class="DMX">
      <div class="dataFormTitle">测试DMX地址</div>
      <div class="onlineControl">
        <div class="onlineControlItems">
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">通道间隔</div>
            <div class="tdled">
              <el-input-number size="medium"
                               v-model="inputJgNum2"></el-input-number>
            </div>
            <div class="tdled">(0-255)</div>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">指定分控</div>
            <div class="tdled">
              <el-select v-model="dmxdesignatedValue"
                         placeholder="请选择"
                         style="width: 130px;">
                <el-option v-for="item in dmxdesignatedOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </div>
          </div>
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px">指定端口</div>
            <div class="tdled">
              <el-select v-model="dmxtcpValue"
                         placeholder="请选择"
                         style="width: 130px;">
                <el-option v-for="item in dmxtcpOptions"
                           :key="item.value"
                           :label="item.label"
                           :value="item.value"></el-option>
              </el-select>
            </div>
          </div>
        </div>
        <div class="onlineControlItems">
          <div class="itemsCont">
            <div class="tdled"
                 style="margin-right:10px;font-size:18px;">手动测试模式</div>
          </div>
          <div class="itemsCont">
            <div class="tdled">
              <el-input-number size="medium"
                               v-model="inputSdNum"></el-input-number>
            </div>
            <div class="tdled">(1-4096)</div>
          </div>
          <div class="itemsCont">
            <div>
              <el-button>手动连续测试</el-button>
            </div>
          </div>
        </div>
        <div class="onlineControlItems"
             style="width:6px">
          <div style="font-size:18px;width:200px;margin-top: 8px;">自动模式测试</div>
          <div class="xmBtn">
            <el-button @click="doTestDMX()">自动测试</el-button>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import * as sysTool from '../../../../../js/systemTool'
import * as cookie from '../../../../../js/cookie'
export default {
  name: 'index',
  data () {
    return {
      radio: '1',
      inputNum: 1, // 起始通道
      inputJgNum1: 1, // 通道间隔1
      inputJgNum2: 1, // 通道间隔2
      inputSdNum: 1, // 手动模式
      chipOptions: [{ // designated
        value: 0,
        label: 'UCS251-A/B'
      }, {
        value: 1,
        label: 'UCE981-A/B'
      }, {
        value: 2,
        label: 'HJSG87-A/B'
      }],
      chipValue: 'UCS251-A/B',
      designatedOptions: [{ // designated
        value: 0,
        label: '所有分控'
      }, {
        value: 1,
        label: '分控1'
      }, {
        value: 2,
        label: '分控2'
      }],
      designatedValue: '所有分控',
      dmxdesignatedOptions: [{ // designated
        value: 0,
        label: '所有分控'
      }, {
        value: 1,
        label: '分控1'
      }, {
        value: 2,
        label: '分控2'
      }],
      dmxdesignatedValue: '所有分控',
      tcpOptions: [{ // designated
        value: 0,
        label: '所有端口'
      }, {
        value: 1,
        label: '端口：8801'
      }, {
        value: 2,
        label: '端口：8802'
      }],
      tcpValue: '所有端口',
      dmxtcpOptions: [{ // designated
        value: 0,
        label: '所有端口'
      }, {
        value: 1,
        label: '端口：8801'
      }, {
        value: 2,
        label: '端口：8802'
      }],
      dmxtcpValue: '所有端口'
    }
  },
  created () {
    this.brower = sysTool.GetCurrentBrowser()
    this.os = sysTool.GetOs()
    this.username = cookie.getCookie('userAccountNumber')
    this.password = cookie.getCookie('userAccountPassword')
  },
  methods: {
    postData (postData) {
      var data = {
        Method: postData.Method,
        Name: this.username,
        Password: this.password,
        Device_ID: this.os,
        Platform: this.brower,
        DevID: postData.DevID,
        Arg: postData.Arg,
        Interval: postData.Interval,
        Controller: postData.Controller,
        Port: postData.Port,
        Start: postData.Start,
        Mode: postData.Mode,
        IC: postData.IC
      }
      console.log(data)
      var msg = JSON.stringify(data)
      var data2 = new FormData()
      data2.append(postData.FormData, msg)
      let url = postData.Url
      this.axios.post(url, data2).then((res) => {
        var resl = res.data
        if (resl.Result === 'OK') {
          this.$message({
            message: res.data.Message,
            type: 'success'
          })
          this.init()
        } else {
          this.$message({
            message: res.data.Message,
            type: 'error'
          })
        }
      })
    },
    // 写码
    doWriteCode () {
      var mode = this.radio === 1 ? 'true' : 'false'
      var data = {
        Method: 'DoWriteCode',
        DevID: 'XB0019000001',
        FormData: 'DoPauseForm',
        Url: 'api/test/test.php',
        Mode: mode,
        Start: this.inputNum,
        Interval: this.inputJgNum1,
        IC: this.chipValue,
        Controller: this.designatedValue,
        Port: '0xFF'
      }
      this.postData(data)
      // var data = {
      //   Method: 'DoWriteCode',
      //   Name: this.username,
      //   Password: this.password,
      //   Device_ID: this.os,
      //   Platform: this.brower,
      //   DevID: 'XB0019000001',
      //   Mode: mode,
      //   Start: this.inputNum,
      //   Interval: this.inputJgNum1,
      //   IC: this.chipValue,
      //   Controller: this.designatedValue,
      //   Port: '0xFF'
      // }
      // var msg = JSON.stringify(data)
      // var data2 = new FormData()
      // data2.append('content', msg)
      // let url = 'api/test/test.php'
      // this.axios.post(url, data2).then((res) => {
      //   var resl = res.data
      //   if (resl.Result === 'OK') {
      //     this.$message({
      //       message: res.data.Message,
      //       type: 'success'
      //     })
      //     this.init()
      //   } else {
      //     this.$message({
      //       message: res.data.Message,
      //       type: 'error'
      //     })
      //   }
      // })
    },
    // 自动测试
    doTestDMX () {
      var data = {
        Method: 'DoTestDMX',
        FormData: 'DoPauseForm',
        Url: 'api/test/test.php',
        DevID: 'XB0019000001',
        Interval: this.inputJgNum2,
        Arg: '测试地址',
        Controller: this.dmxtcpValue,
        Port: '0xFF'
      }
      this.postData(data)
      // var mode = this.radio === 1 ? 'true' : 'false'
      // var data = {
      //   Method: 'DoWriteCode',
      //   Name: this.username,
      //   Password: this.password,
      //   Device_ID: this.os,
      //   Platform: this.brower,
      //   DevID: 'XB0019000001',
      //   Interval: this.inputJgNum2,
      //   Arg: '测试地址',
      //   Controller: this.dmxtcpValue,
      //   Port: '0xFF'
      // }
      // var msg = JSON.stringify(data)
      // var data2 = new FormData()
      // data2.append('content', msg)
      // let url = 'api/test/test.php'
      // this.axios.post(url, data2).then((res) => {
      //   var resl = res.data
      //   if (resl.Result === 'OK') {
      //     this.$message({
      //       message: res.data.Message,
      //       type: 'success'
      //     })
      //     this.init()
      //   } else {
      //     this.$message({
      //       message: res.data.Message,
      //       type: 'error'
      //     })
      //   }
      // })
    }

  }
}
</script>

<style scoped>
.dataFormTitle {
  font-size: 18px;
  margin-bottom: 20px;
}
.onlineControl {
  width: 690px;
  height: 220px;
}
.onlineControlItems {
  float: left;
  width: 290px;
  margin-right: 30px;
}
.itemsCont {
  height: 40px;
  margin-bottom: 20px;
}
.tdled {
  float: left;
  height: 40px;
  line-height: 40px;
  margin-right: 5px;
}
.xmBtn {
  width: 100px;
  height: 180px;
  line-height: 180px;
  text-align: center;
  margin: 0 auto;
}
</style>
<style>
.el-input-number--medium {
  width: 130px;
}
</style>
